* {
    margin: 0;
    padding: 0;
}

.stage {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 300px;
    height: 300px;
    margin: 100px auto;
    // background-color: skyblue;

    div {
        position: absolute;
        top: 0;
        left: 0;
        width: 98px;
        height: 98px;
        margin: 1px;
        transition: all .5s;
        background: url('./刻晴.jpg');
        background-size: 300px auto;
        // &:nth-child(1) {
        //     top: 0;
        //     left: 0;
        //     background-position: 0 0;
        // }
        &.leave {
            transform: scale(.8);
        }

        &.over {
            animation: overing .5s linear infinite alternate;
        }

        @keyframes overing {
            from {
                transform: scale(1);
                box-shadow: 0px 0px 5px 5px rgba(240, 255, 240, .7);

            }
            to {
                transform: scale(.8);
                box-shadow: 0px 0px 5px 5px rgba(240, 255, 240, .7);
            }
        }
    }
    button {
        position: absolute;
        top: 50%;
        left: -140px;
        outline: none;
        width: 100px;
        height: 40px;
        background-color: orange;
        box-shadow: 0 0 5px 5px rgba(240, 255, 240, .7);
        cursor: pointer;
    }
}